<template>
  <el-card>
    <div class="page">
      <h2 class="applyRecode">申请记录</h2>
      <div class="changeBtns">
          <el-button type="primary" :disabled="this.zero != 2" size="small" @click="addapply(0)">添加修改申请</el-button>
          <div>
              <el-button type="primary" size="small" @click="changeword">修改密码</el-button>
              <el-button type="primary" size="small" @click="changetel">更换手机号</el-button>
          </div>
      </div>
      <el-table class="tables" :data="tableData">
          <el-table-column prop="merchantName" label="企业名称" align="center"></el-table-column>
          <el-table-column prop="applyType" label="申请类型" align="center">
            <template slot-scope="scope">
              <span v-if="scope.row.applyType == 1">申请入驻</span>
              <span v-else-if="scope.row.applyType==2">信息修改</span>
            </template>
          </el-table-column>
          <el-table-column label="申请添加时间" align="center">
            <template slot-scope="scope">
              {{ scope.row.createTime | time('-:') }}
            </template>
          </el-table-column>
          <el-table-column prop="verifyState" label="审核状态" align="center">
            <template slot-scope="scope">
              <span v-if="scope.row.verifyState == 0">待提交</span>
              <span v-else-if="scope.row.verifyState == 1">待审核</span>
              <span v-else-if="scope.row.verifyState == 2">已通过</span>
              <span v-else-if="scope.row.verifyState == 3">已驳回</span>
            </template>
          </el-table-column>
          <el-table-column label="操作" align="center">
            <template slot-scope="scope">
              <el-button type="text" @click="look(0,scope.row)" size="small">查看</el-button>
              <el-button v-if="scope.row.verifyState == 0 || scope.row.verifyState == 3" @click="edit(1,scope.row)" type="text" size="small">编辑</el-button>
              <el-button v-if="scope.row.verifyState == 0" @click="subvery(scope.row)" type="text" size="small">提交审核</el-button>
              <el-button v-if="scope.row.verifyState == 1" @click="golast(scope.row)" type="text" size="small">撤销审核</el-button>
            </template>
          </el-table-column>
      </el-table>
      <div class="page">
        <el-pagination background style="float:right;margin:26px 0 30px"
          @size-change="handleSizeChange"
          @current-change="handleCurrentChange"
          :current-page="currentPage"
          :page-sizes="[10, 20, 30, 40]"
          :page-size="pagesize"
          layout="total, sizes, prev, pager, next, jumper"
          :total="total">
        </el-pagination>
      </div>
    </div>
  </el-card>
</template>
<script>
export default {
  name: 'homeIndex',
  data () {
    return {
      currentPage: 1,
      pagesize: 10,
      total: 0,
      tableData: [],
      zero: ''
    }
  },
  created () {
    this.init()
  },
  methods: {
    init () {
      this.$tkAjax.post(`${this.$config.baseUrl}/merchant/merchantApplyRecord/getPageMerchantApplyRecordByCondition`, {}, {
        params: {
          condition: {
            merchantId: this.$store.state.merchantId
          },
          isGetTotalCount: true,
          page: this.currentPage,
          pageSize: this.pagesize
        }
      }).then(res => {
        console.log(res)
        if (Array.isArray(res.data.content.list)) {
          this.tableData = res.data.content.list
          this.zero = res.data.content.list[0].verifyState
          // console.log(this.zero)
        }
        this.total = res.data.content.totalCount
      }).catch(err => {
        console.log(err)
        // this.$message.warning(err.data.message)
      })
    },
    look (num, row) {
      this.$router.push({
        path: '/addapply',
        query: {
          look: num,
          appid: row.applyRecordId
        }
      })
    },
    edit (num, row) {
      this.$router.push({
        path: '/addapply',
        query: {
          nu: num,
          appid: row.applyRecordId
        }
      })
    },
    //提交审核
    subvery (row) {
      let condition = {
        applyRecordId: row.applyRecordId,
        verifyState: '1'
      }
      this.$tkAjax.post(`${this.$config.baseUrl}/merchant/merchantApplyRecord/updateMerchantApplyRecordById`, {}, {
        params: {
          condition: condition,
          submitFlg: '1'
        }
      }).then(res => {
        this.$message.success('提交审核成功')
        this.init()
      }).catch(err => {
        this.$message.warning(err.data.content)
      })
    },
    //撤销审核
    golast (row) {
      let condition = {
        applyRecordId: row.applyRecordId,
        verifyState: '0'
      }
      this.$tkAjax.post(`${this.$config.baseUrl}/merchant/merchantApplyRecord/updateMerchantApplyRecordById`, {}, {
        params: {
          condition: condition,
          submitFlg: '0'
        }
      }).then(res => {
        this.$message.success('撤销审核成功')
        this.init()
      }).catch(err => {
        this.$message.warning(err.data.content)
      })
    },
    changeword () {
      this.$router.push('/changeword')
    },
    changetel () {
      this.$router.push('/changetel')
    },
    //点击添加修改申请  按钮
    addapply (num) {
      this.$router.push({
        path: '/addapply',
        query: {
          bo: num
        }
      })
    },
    handleSizeChange (val) {
      this.pagesize = val
      this.init()
    },
    handleCurrentChange (val) {
      this.currentPage = val
      this.init()
    }
  }
}
</script>
<style lang="scss" scoped>
.page {
    .applyRecode {
        color: #000;
    }
    .changeBtns {
        padding: 0.8rem 0;
        display: flex;
        justify-content: space-between;
        align-items: center;
        .el-button {
          border-radius: 0.25rem;
        }
    }
    .el-table {
      .th.is-center {
        background-color: #f5f5f5;
      }
    }
}
</style>
